<html>
<head>
<title>Pedidos a elaborar</title>
<style type="text/css">
body {
	background-color: gray;
	padding: 20px;
	font-family: Segoe UI;
}

h1,h2 {
	font-weight: lighter;
}

h1 {
	border-bottom: 1px solid black;
}

.button {
	margin-top: 5px;
	clear: both;
	width: 150px;
}

#abrir-mesa {
	width: 50%;
	border: 1px solid black;
	margin-left: 25%;
	background-color: white;
	padding: 20px;
}

.text-box {
	float: left;
}

.separator {
	border-bottom: 1px solid black;
	margin-bottom: 10px;
	height: 10px;
	clear: both;
}

.left {
	float: left;
}

.clear {
	clear: both;
}

.fixed {
	width: 40%;
}

.center {
	margin-left: 5%;
}

table {
	border: 1px solid black;
	text-align: center;
	width: 100%;
}

td {
	border: 1px solid black;
	padding: 5px;
}

.header {
	background-color: gray;
	font-weight: bold;
}
</style>
</head>
<body>
	<div id="abrir-mesa">
		<h1>Pedidos a elaborar</h1>

		<h2>Elija un area de elaboracion</h2>

		<select>
			<option value="1">Cocina</option>
			<option value="2">Barra</option>
			<option value="3">Cafeteria</option>
			<option value="4">Etc..</option>
		</select>

		<div class="separator"></div>

		<table>
			<tr class="header">
				<td>Numero de pedido</td>
				<td>Plato</td>
				<td>Cantidad</td>
			</tr>
			<tr>
				<td>1</td>
				<td>Bife de chorizo</td>
				<td>2</td>
			</tr>
			<tr>
				<td>1</td>
				<td>Sorrentinos</td>
				<td>2</td>
			</tr>
			<tr>
				<td>5</td>
				<td>Milanesa a la napolitana</td>
				<td>1</td>
			</tr>
		</table>
	</div>
<body>
<html>